<!DOCTYPE html>
  <html>
  <head>
      <meta charset="utf-8">
      <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
      <title>双良</title>
      <link rel="stylesheet" type="text/css" href="../../css/api.css" />
      <link rel="stylesheet" type="text/css" href="../../css/common.css" />
      <link rel="stylesheet" type="text/css" href="../../css/aui.css" />
    	<link rel="stylesheet" type="text/css" href="../../css/aui-pull-refresh.css" />
      <link rel="stylesheet" type="text/css" href="../../css/index.css" />
      <style>
          html, body {width: 100%;min-height: 100%;background: #ffffff;}

          [v-cloak] {
              display: none;
          }
      </style>
  </head>
  <body style="background-color: #f9f9f9;">
<div id="app" >

  <header id="header_top" class="aui-bar aui-bar-nav aui-bar-light header_order_inner">
    <a class="aui-pull-left" onclick="goback()">
        <span class="aui-iconfont aui-icon-left"></span>
    </a>
    <div class="aui-title">订单详情</div>

    <span class="header_order_inner_span">待揽件</span>

  </header>

  <div class="aui-refresh-content">
  <div class="order_inner">
    <div class="order_inner_box" id="order_inner_box1">
      <div class="order_inner_box_icon"><img src="../../image/index_icon1.png"></div>
      <ul>
        <li><img src="../../image/store_icon.png"><h5><span>揽件店铺：</span>天天商铺</h5></li>
        <li><p><span>姓名：</span>朱莉敏</p></li>
        <li><p><span>联系方式：</span>18717237444</p></li>
        <li><p><span>工业区：</span>西湖区</p></li>
        <li><p><span>揽件地址：</span>浙江省杭州市西湖区文三路</p></li>
        <li class="clearfix"><p><span>车辆：</span>小面包车</p><p><span>尺寸：</span>1.8*1.3*1.1米</p></li>
      </ul>
    </div>

    <div class="order_inner_box" id="order_inner_box2">
      <ul>
        <li><img src="../../image/store_icon.png"><h5><span>收件企业：</span>丫丫商铺</h5></li>
        <li><p><span>姓名：</span>小喵喵</p></li>
        <li><p><span>联系方式：</span>18717237444</p></li>
        <li><p><span>地点类型：</span>门卫</p></li>
        <li><p><span>工业区：</span>滨江区</p></li>
        <li><p><span>派送地址：</span>浙江省杭州市西湖区文三路</p></li>
        <li class="clearfix"><p><span>是否回单：</span><font>是</font></p><p><span>加急或夜送：</span><font>加急</font></p></li>
      </ul>
    </div>

    <div class="order_inner_map">
      <div id="orderMap"></div>
      <div class="order_inner_map_btn">
        <span class="no">无法配送</span>
        <span class="yes" onclick="openWinInfo(1)">可以配送</span>
      </div>
    </div>

  </div>
  </div>

  </body>
  <script type="text/javascript" src="../../script/api.js"></script>
  <script type="text/javascript" src="../../script/zepto.js"></script>
  <script type="text/javascript" src="../../script/vue.min.js"></script>
  <script type="text/javascript" src="../../script/utils.js"></script>
  <script type="text/javascript" src="../../script/common.js"></script>
  <script type="text/javascript" src="../../script/aui-tab.js"></script>
  <script type="text/javascript" src="../../script/aui-scroll.js"></script>
  <script type="text/javascript" src="../../script/aui-pull-refresh.js"></script>
  <script type="text/javascript">

  var header_top = $api.byId('header_top');
  var header_topPos = $api.offset(header_top);

  var order_inner_box1 = $api.byId('order_inner_box1');
  var order_inner_box1Pos = $api.offset(order_inner_box1);

  var order_inner_box2 = $api.byId('order_inner_box2');
  var order_inner_box2Pos = $api.offset(order_inner_box2);

        var map = null

  function goback(){
    api.closeWin();
  }


  function openWinInfo(type){
    api.openWin({
        name: 'type',
        url: './list_inner_check.html',
        pageParam: {
            name: 'test'
        }
    });

  }


      apiready = function(){
        map = api.require('bMap');
        api.parseTapmode();
        setRefresh();

        map.getCoordsFromName({
            address: "华星时代广场"
        }, function(ret, err) {
            if (ret.status) {
              console.log(ret.lon)
              console.log(ret.lat)
              bMap.open({
                rect: {
                  x: 0,
                  y: header_topPos.h + order_inner_box1Pos.h + order_inner_box2Pos.h,
                  w: 320,
                  h: 300
                },
                center: {
                    lon: ret.lon,
                    lat: ret.lat
                },
                zoomLevel: 20,
                showUserLocation: true,
                fixedOn: api.frameName,
                fixed: false
              }, function(r) {
                if (r.status) {
                  bMap.addAnnotations({
                    annotations: [{
                        id: 1,
                        lon: ret.lon,
                        lat: ret.lat
                    }],
                    draggable: false
                    });
                }
              });
            } else {
              api.toast({ msg: err.code,duration: 2000,location:'middle' });
            }
        });
        // map.open({
        //     rect: {
        //         x: 0,
        //         y: header_topPos.h + order_inner_box1Pos.h + order_inner_box2Pos.h,
        //         w: 320,
        //         h: 300
        //     },
        //     center: {
        //         lon: 116.4021310000,
        //         lat: 39.9994480000
        //     },
        //     zoomLevel: 10,
        //     showUserLocation: true,
        //     fixedOn: api.frameName,
        //     fixed: false
        // }, function(ret) {
        //     if (ret.status) {
        //         alert('地图打开成功');
        //     }
        // });

      };


      //刷新
      function setRefresh() {
          var pullRefresh = new auiPullToRefresh({
              container: document.querySelector('.aui-refresh-content'),
              triggerDistance: 100
          }, function(ret) {

              if (ret.status == "success") {
                  setTimeout(function() {
                      pullRefresh.cancelLoading(); //刷新成功后调用此方法隐藏
                  }, 1500)
              }
          })
      }






  </script>
  </html>
